<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>04 数组常用的方法</title>
</head>

<body>
    <h1>04 数组常用的方法</h1>
</body>
<script>
    /*
        方法（常用）：
            * push()：往数组尾部添加一个或多个元素，返回数组新的长度
            * pop()：删除数组最后一个元素，返回删除的元素
            * unshift()：往数开头部添加一个或多个元素，返回数组新的长度
            * shift()：删除数组第一个元素，返回删除的元素
            * aplice(start, dalateNum,...,items)：在数组中插入、删除、替换的通用方法
                * start：起始索引位置
                * dalateNum：要删除的数量
                * items：插入的元素（可以的多个）
            * splice(start,end,[参数3，参数4])：返回数组的片段或子数组，从start开始到end（不包括end所对应的元素），参数3起为可选参数
            * sort()：将数组中的元素排序，并返回排序后的数组
                * 默认：以字符串的排列方式（转换成ASSCLL码来比对）
                * 参数（比较函数）：利用fn的返回值来确定数组中两个数的位置（假设两个数为a,b）
                    * 返回负数：确定a在b前 [a,b,...]
                    * 返回0：不改变现有位置
                    * 返回正数：确定a在b后 [b,a,...]
            * reverse()：将数组中的元素颠倒顺序，返回逆序后的数组
            * join(separator)：返回字符串值，其中包含了连接在一起的数组的所有元素
                * separator：为分隔符，默认为逗号
    */

    var arr = [1, 2, 3, 4];
    console.log('原始数据:' + arr);

    // 在末尾添加数据:至少一个实参
    arr.push(5);
    document.write('末尾添加数据push(): [' + arr + ']' + '<br><br>');

    // 从前面添加数据:至少一个实参
    arr.unshift(123);
    document.write('前面添加数据unshift(): [' + arr + ']' + '<br><br>');

    // 删除末尾的一个数：不需要实参
    arr.pop();
    document.write('删除末尾的一个数pop(): [' + arr + ']' + '<br><br>');

    // 删除后面若干个数据：循环 例2个
    for (var i = 0; i < 2; i++) {
        arr.pop();
    }
    document.write('删除后面若干个数据pop(): [' + arr + ']' + '<br><br>');

    // 从前面删除数据：不需要实参
    arr.shift();
    document.write('删除后面若干个数据shift(): [' + arr + ']' + '<br><br>');

    // splice方法的使用
    var arr2 = [1, 2, 3, 4, 5, 6];
    document.write('初始数据: [' + arr2 + ']' + '<br><br>');

    // arr2.splice(1, 1); // 前一个参数代表下标，后一个参数代表从下标开始删除几个数据
    // document.write('splice()从arr2的任意位置删除数据: [' + arr2 + ']' + '<br><br>');

    // arr2.splice(2, 2, 7, 8);
    // document.write('splice()从arr2的任意位置替换数据: [' + arr2 + ']' + '<br><br>');

    arr2.splice(2, 0, 7, 8);
    document.write('splice()从arr2的任意位置插入数据: [' + arr2 + ']' + '<br><br>'); // 从前面插入

    // slice()  截取数组
    var arr3 = [11, 22, 33, 44];
    var arr4 = arr3.slice(1, 3); // 从下标1到3之间，包头不包尾，不改变原数组
    document.write('arr3: [' + arr3 + ']' + '<br><br>');
    document.write('slice()后的arr4: [' + arr4 + ']' + '<br><br>');

    // 排序  sort() 可以自动对字母和小于十的数字进行排序，针对数字的排序要传一个回调函数
    var arr5 = ['b', 'c', 'a', 'v', 'd'];
    arr5.sort();
    document.write('sort()后的arr5: [' + arr5 + ']' + '<br><br>');

    var arr6 = [123, 45, 48, 352, 15, 44];
    document.write('arr6: [' + arr6 + ']' + '<br><br>');
    arr6.sort(function (a, b) {
        // return a - b; // 升序
        return b - a; // 降序
    })
    document.write('sort()后的arr6: [' + arr6 + ']' + '<br><br>');

    // reverse() 倒序
    var arr7 = ['b', 'c', 'a', 'v', 'd'];
    arr7.reverse();
    document.write('reverse()后的arr7: [' + arr7 + ']' + '<br><br>');

    // join() 将数组拼接变成字符串
    var arr8 = [1,2,3];
    var str = arr8.join('-');
    var str1 = arr8.join();
    var str2 = arr8.join('');
    var str3 = arr8.join(' ');
    var str4 = arr8.join('&');
    document.write('arr8: [' + arr8 + ']' + '<br><br>');
    document.write('join()后的arr8: [' + str + ']' + '<br><br>');
    document.write('join()后的arr8: [' + str1 + ']' + '<br><br>');
    document.write('join()后的arr8: [' + str2 + ']' + '<br><br>');
    document.write('join()后的arr8: [' + str3 + ']' + '<br><br>');
    document.write('join()后的arr8: [' + str4 + ']' + '<br><br>');

</script>

</html>